<template>
	<view class="System">
		<view class="item" v-for="i in consten" :key="i">
			<image :src="i.image||'/pagesB/static/微信图片_20201124091755.png'" v-if="i.image"></image>
			<view class="title">
			<view class="yuan" v-if="i.is_read == 1"></view>
			{{ i.title }}</view>
			<view class="order_title">
				<view class="title_left">
					{{ i.date_add }}
				</view>
				<view class="title_right">查看详情</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			consten:[],
			access_token:'',
			model:''
		};
	},
	onShow() {
		let _this=this
		uni.getSystemInfo({
		    success: function (res) {
				_this.model=res.model
		    }
		});
		if(uni.getStorageSync('access_token')){
		this.access_token=JSON.parse(uni.getStorageSync('access_token'))
		}
		this.$request('/app/message/getSystemMessages', 'post', {
			page: this.page,
			t:this.model,
			access_token:this.access_token
		}).then(res => {
			if(res.errcode==0){
				function dateTO(data) {
					//data为时间戳
					var date = new Date(data);
					var Y = date.getFullYear() + '-';
					var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
					var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
					var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
					var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
					var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
					var strDate = Y + M + D + h + m + s; //转换为年月日时分秒
					// var strDate = Y + M + D; //转换为年月日
					return strDate;
				}
				res.content.forEach(v=>{
					v.date_add=dateTO(v.date_add * 1000)
				})
				this.consten=res.content
				}
		})
	},
	onReachBottom(){
		this.page=this.page++
		this.$request('/app/message/getSystemMessages', 'post', {
			page: this.page,
			t:this.model,
			access_token:this.access_token
		}).then(res => {
			if(res.data.errcode==0){
				function dateTO(data) {
					//data为时间戳
					var date = new Date(data);
					var Y = date.getFullYear() + '-';
					var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
					var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
					var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
					var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
					var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
					var strDate = Y + M + D + h + m + s; //转换为年月日时分秒
					// var strDate = Y + M + D; //转换为年月日
					return strDate;
				}
				res.content.forEach(v=>{
					v.date_add=dateTO(v.date_add * 1000)
				})
				res.data.content.forEach(v=>{
				this.consten.push(v)

				})
				}
		})
	}
};
</script>

<style lang="less">
.System {
	height: 100%;
	background-color: #f3f4f5;
	padding-top: 20rpx;
	overflow-x: scroll;
	.item {
		background-color: #fff;
		padding: 16rpx;
		margin-bottom: 20rpx;
		image {
			width: 100%;
			margin-bottom: 20rpx;
		}
		.title {
			font-size: 28rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #111111;
			display: flex;
			align-items: center;
			white-space: pre-wrap;
			.yuan {
				width: 18rpx;
				height: 18rpx;
				background: #db1b22;
				border-radius: 50%;
			}
		}
		.order_title {
			display: flex;
			justify-content: space-between;
			padding: 20rpx 0;
			background: url(@/static/direction_right_gray.png) no-repeat 690rpx 25rpx;
			background-size: 28rpx 28rpx;
			.title_left {
				font-size: 28rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #111111;
			}
			.title_right {
				font-size: 24rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #9da5a8;
				padding-right: 30rpx;
			}
		}
	}
}
</style>
